<template>
  <div ref="print" class="fs14" style="width:800px; margin: 0 auto;">
    <!-- <h2 style="text-align: center;margin-top:15px">领料单</h2> -->
    <!-- 工单信息 -->
    <table class="bor-through">
      <tr>
        <div class="l" style="padding-left: -30px"><img :src="data.title" width="200px" height="15px" /></div>
        <td width="33%" align="center" height="24" style="font-size: 24px;"></td>
        <td width="33%" align="center" height="24" style="font-size: 30px;">营业额汇总</td>
        <td width="33%" align="right" height="24" style="font-size:12px;"></td>
      </tr>
    </table>

    <table class="fs12" style="width:calc(100% - 50px);margin-left: 25px;">
      <tr>
        <td style="text-align:right;">日期:{{ data.month }}</td>
        <td style="text-align:right;">单价 (元)</td>
      </tr>
    </table>

    <table class="bor fs12" style="width:calc(100% - 40px);margin-left: 25px;">
      <tr>
        <td style="width: 13%;text-align:center;" colspan="3">本期营业总收入:</td>
        <td style="width: 13%;text-align:center;" colspan="3">{{ data.allReport.sumReceive ? data.allReport.sumReceive : 0 }}</td>
      </tr>
      <tr>
        <td style="width: 13%;text-align:left;">本期索赔总收入:</td>
        <td style="width: 13%;text-align:left;">{{ data.allReport.sumSAmount ? data.allReport.sumSAmount : 0 }}</td>
        <td style="width: 13%;text-align:left;">本期营业净收入:</td>
        <td style="width: 20%;text-align:left;">{{ data.allReport.sumReceive - data.allReport.partCostAmount ? data.allReport.sumReceive - data.allReport.partCostAmount : 0 }}</td>
        <td style="width: 13%;text-align:left;">维修优惠总金额:</td>
        <td style="width: 20%;text-align:left;">{{ data.allReport.sumDiscount ? data.allReport.sumDiscount : 0 }}</td>
      </tr>
      <tr>
        <td style="width: 13%;text-align:left;">配件总收入:</td>
        <td style="width: 13%;text-align:left;">{{ data.allReport.sumPartAmount ? data.allReport.sumPartAmount : 0 }}</td>
        <td style="width: 13%;text-align:left;">工时总收入:</td>
        <td style="width: 20%;text-align:left;">{{ data.allReport.sumLabourAmount ? data.allReport.sumLabourAmount : 0 }}</td>
        <td style="width: 13%;text-align:left;">附加项目总收入:</td>
        <td style="width: 20%;text-align:left;">{{ data.allReport.sumAddAmount ? data.allReport.sumAddAmount : 0 }}</td>
      </tr>
    </table>

    <!-- 车辆信息 -->
    <div style="height:10px;clear:both"></div>
    <table class="bor fs12" style="width:calc(100% - 40px);margin-left: 25px;">
      <tr>
        <td style="text-align:center;">工单类型</td>
        <td style="text-align:center;">配件金额</td>
        <td style="text-align:center;">工时金额</td>
        <td style="text-align:center;">附加项目金额</td>
      </tr>
      <tr>
        <td style="text-align:center;">首保</td>
        <td style="text-align:center;">{{ data.allReport.sbPart ? data.allReport.sbPart : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.sbLabour ? data.allReport.sbLabour : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.sbAdd ? data.allReport.sbAdd : 0 }}</td>
      </tr>
      <tr>
        <td style="text-align:center;">PDI</td>
        <td style="text-align:center;">{{ data.allReport.pdiPart ? data.allReport.pdiPart : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.pdiLabour ? data.allReport.pdiLabour : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.pdiAdd ? data.allReport.pdiAdd : 0 }}</td>
      </tr>
      <tr>
        <td style="text-align:center;">定保</td>
        <td style="text-align:center;">{{ data.allReport.dbPart ? data.allReport.dbPart : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.dbLabour ? data.allReport.dbLabour : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.dbAdd ? data.allReport.dbAdd : 0 }}</td>
      </tr>
      <tr>
        <td style="text-align:center;">机电</td>
        <td style="text-align:center;">{{ data.allReport.jdPart ? data.allReport.jdPart : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.jdLabour ? data.allReport.jdLabour : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.jdAdd ? data.allReport.jdAdd : 0 }}</td>
      </tr>
      <tr>
        <td style="text-align:center;">钣金</td>
        <td style="text-align:center;">{{ data.allReport.bjPart ? data.allReport.bjPart : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.bjLabour ? data.allReport.bjLabour : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.bjAdd ? data.allReport.bjAdd : 0 }}</td>
      </tr>
      <tr>
        <td style="text-align:center;">喷漆</td>
        <td style="text-align:center;">{{ data.allReport.pqPart ? data.allReport.pqPart : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.pqLabour ? data.allReport.pqLabour : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.pqAdd ? data.allReport.pqAdd : 0 }}</td>
      </tr>
      <tr>
        <td style="text-align:center;">美容</td>
        <td style="text-align:center;">{{ data.allReport.mrPart ? data.allReport.mrPart : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.mrLabour ? data.allReport.mrLabour : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.mrAdd ? data.allReport.mrAdd : 0 }}</td>
      </tr>
      <tr>
        <td style="text-align:center;">定检</td>
        <td style="text-align:center;">{{ data.allReport.djPart ? data.allReport.djPart : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.djLabour ? data.allReport.djLabour : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.djAdd ? data.allReport.djAdd : 0 }}</td>
      </tr>
      <tr>
        <td style="text-align:center;">电池维修</td>
        <td style="text-align:center;">{{ data.allReport.dcwxPart ? data.allReport.dcwxPart : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.dcwxLabour ? data.allReport.dcwxLabour : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.dcwxAdd ? data.allReport.dcwxAdd : 0 }}</td>
      </tr>
      <tr v-if="this.appId == 'arcfox'">
        <td style="text-align:center;">服务活动</td>
        <td style="text-align:center;">{{ data.allReport.fuhdPart ? data.allReport.fuhdPart : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.fuhdLabour ? data.allReport.fuhdLabour : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.fuhdAdd ? data.allReport.fuhdAdd : 0 }}</td>
      </tr>
      <tr v-if="this.appId == 'arcfox'">
        <td style="text-align:center;">新增项目</td>
        <td style="text-align:center;">{{ data.allReport.xzxmPart ? data.allReport.xzxmPart : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.xzxmLabour ? data.allReport.xzxmLabour : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.xzxmAdd ? data.allReport.xzxmAdd : 0 }}</td>
      </tr>
      <tr v-if="this.appId == 'arcfox'">
        <td style="text-align:center;">售前</td>
        <td style="text-align:center;">{{ data.allReport.sqPart ? data.allReport.sqPart : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.sqLabour ? data.allReport.sqLabour : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.sqAdd ? data.allReport.sqAdd : 0 }}</td>
      </tr>
      <tr v-if="this.appId == 'arcfox'">
        <td style="text-align:center;">售后</td>
        <td style="text-align:center;">{{ data.allReport.shPart ? data.allReport.shPart : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.shLabour ? data.allReport.shLabour : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.shAdd ? data.allReport.shAdd : 0 }}</td>
      </tr>
      <tr v-if="this.appId == 'arcfox'">
        <td style="text-align:center;">其他</td>
        <td style="text-align:center;">{{ data.allReport.qtPart ? data.allReport.qtPart : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.qtLabour ? data.allReport.qtLabour : 0 }}</td>
        <td style="text-align:center;">{{ data.allReport.qtAdd ? data.allReport.qtAdd : 0 }}</td>
      </tr>
    </table>

    <!-- 配件信息 -->
    <div style="height:10px;clear:both"></div>
    <table class="bor fs12" style="width:calc(100% - 40px);margin-left: 25px;">
      <tr>
        <td style="text-align:center;">本期入库总金额</td>
        <td style="text-align:center;">{{ data.partReport.inAmount }}</td>
        <td style="text-align:center;">本期出库总金额</td>
        <td style="text-align:center;">{{ data.partReport.outAmount }}</td>
      </tr>
      <tr v-for="(x, indexItem) in data.typeReport" :key="x.index + 'item'" v-if="indexItem % 2 == 0">
        <td style="text-align:center;">{{ x.IN_OUT_NAME }}</td>
        <td style="text-align:center;">{{ x.COST_AMOUNT }}</td>
        <td style="text-align:center;">{{ data.typeReport[indexItem + 1] ? data.typeReport[indexItem + 1].IN_OUT_NAME : '' }}</td>
        <td style="text-align:center;">{{ data.typeReport[indexItem + 1] ? data.typeReport[indexItem + 1].COST_AMOUNT : '' }}</td>
      </tr>
    </table>
  </div>
</template>
<style scoped>
* {
  margin: 0;
  padding: 0;
}
</style>
<script>
/**
 * @Author: 杨光宇
 * @Date: 20201/02/02
 **/
import moment from 'moment';
import Cookies from 'js-cookie';
import { getAppId } from '@/assets/js/auth';

export default {
  props: {
    data: {
      type: Object,
      required: true,
      default() {
        return {};
      }
    }
  },
  data() {
    return {
      isPreview: false,
      nowTime: moment().format('YYYY-MM-DD HH:mm:ss'),
      dealerName: Cookies.get('dealerName'),
      dealerAddress: Cookies.get('dealerAddress'),
      dealerPhone: Cookies.get('dealerPhone'),
      totalAmount: 0,
      totalCount: 0,
      list: []
    };
  },
  created() {
    this.handle();
  },
  computed: {
    appId() {
      return getAppId();
    }
  },
  methods: {
    fillInToDom() {
      this.isPreview = true;
    },
    handle() {
      // this.data.title = require('@/assets/img/beijing.png');
      console.log(this.appId, 'this.appId');
      if (this.appId == 'beijing') {
        this.data.title = require('@/assets/img/beijing.png');
      } else {
        this.data.title = require('@/assets/img/arcfox.png');
      }
    }
  },
  mounted() {
    console.log('打印=>data', this.data);
    this.$emit('onPrintTable', this.$refs.print.innerHTML);
  }
};
</script>
<style scoped></style>
